<template>
  <div style="position: relative">
    <div class="mask" v-if="handleType == 'look'"></div>
    <a-form
      v-if="formState.objectType == 'waste'"
      ref="formRef"
      layout="inline"
      :model="formState"
 
      :wrapper-col="wrapperCol"
      style="display: flex; flex-wrap: wrap"
    >
      <a-form-item
        style="width: 31%"
        ref="objectCode"
        label="医废编号："
        name="objectCode"
      >
        {{ formState.objectCode }}
      </a-form-item>

      <a-form-item style="width: 31%" label="医废类型：">
        {{ formState.wasteBaseVo.wasteClassifyName }}
      </a-form-item>
      <a-form-item style="width: 31%" label="医废暂存点：">
        {{ formState.wasteBaseVo.hospitalPlaceName }}
      </a-form-item>
      <div class="info pt24 pr24 pl24 pb10" style="margin: 20px 0">
        <div class="s-d-flex s-jc-space-between mb18">
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">收集重量：</span
              >{{ dataForm.collectWeight ? dataForm.collectWeight : 0 }}KG
            </div>
          </div>
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">入库重量：</span
              >{{ dataForm.inWeight ? dataForm.inWeight : 0 }}KG
            </div>
          </div>
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">出库重量：</span
              ><span class="text-danger"
                >{{ dataForm.outWeight ? dataForm.outWeight : 0 }}KG</span
              >
            </div>
          </div>
        </div>
        <div class="s-d-flex s-jc-space-between">
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">收集时间：</span
              >{{ dataForm.collectTime ? dataForm.collectTime : "" }}
            </div>
          </div>
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">入库时间：</span
              >{{ dataForm.inTime ? dataForm.inTime : "" }}
            </div>
          </div>
          <div class="s-tal flex-1">
            <div class="mb15">
              <span style="font-weight: 700">出库时间：</span
              >{{ dataForm.outTime ? dataForm.outTime : "" }}
            </div>
          </div>
        </div>
      </div>
      <a-form-item
        style="width: 31%"
        :label="`${formState.type.includes('time') ? '超时：' : '超重：'}`"
      >
        <span class="text-danger" v-if="formState.type.includes('time')">
          {{ timeFn(formState.createTime) }}
        </span>
        <span v-else class="text-danger"
          >{{
            dataForm.outWeight - dataForm.collectWeight == 0
              ? 0
              : Math.abs(dataForm.outWeight - dataForm.collectWeight)
          }}KG</span
        >
      </a-form-item>
      <a-form-item style="width: 31%" label="收集人：">
        {{ formState.wasteBaseVo.collectUserStaffName }}
      </a-form-item>
      <a-form-item style="width: 31%" label="科室交接人：">
        {{ formState.wasteBaseVo.handUserStaffName }}
      </a-form-item>
      <a-form-item
        style="width: 100%; margin-top: 20px"
        ref="remark"
        label="处理意见"
        name="remark"
         v-if="handleType != 'look'"
      >
        <a-textarea
          placeholder="请输入处理意见"
          v-model:value="formState.remark"
          showCount
          :maxlength="120"
        />
      </a-form-item>
        <template v-else >
       <a-form-item style="width: 31%;margin-top:20px" label="处理意见">
        {{ formState.remark }}
      </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理人">
        {{ formState.modifyUser }}
      </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理时间">
        {{ formState.modifyTime }}
      </a-form-item>
      </template>
    </a-form>
    <a-form
      v-else-if="formState.objectType == 'depart'"
      ref="formRef"
      layout="inline"
      :model="formState"

      :wrapper-col="wrapperCol"
      style="display: flex; flex-wrap: wrap"
    >
      <a-form-item style="width: 31%" label="科室名称：">
        {{ formState.hospitalDepartName }}
      </a-form-item>
      <a-form-item style="width: 31%" label="上次收运时间：">
        {{ formState.time }}
      </a-form-item>
      <a-form-item style="width: 31%" label="超时：">
        <span class="text-danger"> {{ timeFn(formState.createTime) }}</span>
      </a-form-item>
      <a-form-item
        style="width: 100%; margin-top: 20px"
        ref="remark"
        label="处理意见"
        name="remark"
        v-if="handleType != 'look'"
      >
        <a-textarea 
          placeholder="请输入处理意见"
          v-model:value="formState.remark"
          showCount
          :maxlength="120"
        />
      </a-form-item>
      <template v-else >
       <a-form-item style="width: 31%;margin-top:20px" label="处理意见">
        {{ formState.remark }}
      </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理人">
        {{ formState.modifyUser }}
      </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理时间">
        {{ formState.modifyTime }}
      </a-form-item>
      </template>
       
    </a-form>
     <a-form
      v-else
      ref="formRef"
      layout="inline"
      :model="formState"
 
      :wrapper-col="wrapperCol"
      style="display: flex; flex-wrap: wrap"
    >
      <a-form-item
        style="width: 31%"
        label="集装箱编号："
      >
        {{ dataForm.wasteBox.code }}
      </a-form-item>
      <a-form-item
        style="width: 31%"
        label="医废暂存点："
      >
      {{dataForm.wasteBases[0].hospitalPlaceName}}
      </a-form-item>
    <div class="info pt24 pr24 pl24 pb10" style="margin:20px 0">
            <div class="s-d-flex s-jc-space-between mb18">
              <div class="s-tal flex-1">
                <div class="mb15"><span style="font-weight: 700;">收集重量：</span>{{dataForm.collectWeight ? dataForm.collectWeight : 0}}KG</div>
              </div>

              <div class="s-tal flex-1">
                <div class="mb15"><span style="font-weight: 700;">出库重量：</span><span class="text-danger">{{dataForm.wasteBoxRecord.outWeight ? dataForm.wasteBoxRecord.outWeight : 0}}KG</span></div>
              </div>
              <div class="s-tal flex-1">
              </div>
            </div>
            <div class="s-d-flex s-jc-space-between">
              <div class="s-tal flex-1">
                <div class="mb15"><span style="font-weight: 700;">收集时间：</span>{{dataForm.wasteBases[0].createTime ? dataForm.wasteBases[0].createTime : ''}}</div>
              </div>
              <div class="s-tal flex-1">
                <div class="mb15"><span style="font-weight: 700;">出库时间：</span>{{dataForm.wasteBoxRecord.outTime ? dataForm.wasteBoxRecord.outTime : ''}}</div>
              </div>
              <div class="s-tal flex-1">
              </div>
            </div>
          </div>
          <div style="width:100%">
            <a-table  :dataSource="currentTableData" :columns="columns" />
          </div>
            <a-form-item style="width: 31%;margin-top:20px" label="超重：">
        <span class="text-danger">
                  {{dataForm.wasteBoxRecord.outWeight - dataForm.collectWeight == 0 ? 0 : Math.abs(dataForm.wasteBoxRecord.outWeight - dataForm.collectWeight).toFixed(2)}}KG
                </span>
      </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="收集人：">
          {{dataForm.wasteBases[0].collectUserStaffName}}
       </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="科室交接人：">
          {{dataForm.wasteBases[0].handUserStaffName}}
       </a-form-item>
       <a-form-item
        style="width: 100%; margin-top: 20px"
        ref="remark"
        label="处理意见"
        name="remark"
         v-if="handleType != 'look'"
      >
        <a-textarea
          placeholder="请输入处理意见"
          v-model:value="formState.remark"
          showCount
          :maxlength="120"
        />
      </a-form-item>
       <template v-else>
          <a-form-item style="width: 31%;margin-top:20px" label="处理意见：">
          {{formState.remark}}
       </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理人：">
          {{dataForm.wasteBases[0].modifyUser}}
       </a-form-item>
       <a-form-item style="width: 31%;margin-top:20px" label="处理时间：">
          {{dataForm.wasteBases[0].modifyTime}}
       </a-form-item>
       </template>
     
     </a-form>
  </div>
</template>
<script>
import {
  defineComponent,
  onMounted,
  reactive,
  ref,
  toRaw,
  toRef,
  toRefs,
  watch,
} from "vue";
import * as inventoryApi from "@/api/inventory.js";
import * as department from "@/api/department.js";
import { message } from "ant-design-vue";
import { getUserInfo } from "@/utils/auth";
import * as consumableApi from "@/api/consumable.js";
import { hospitalDepartList } from "@/api/hospitalDepart.js";
import * as utils from "@/utils/index.js";
import * as alarmRecordApi from "@/api/alarmRecord";


export default defineComponent({
  props: {
    handleType: {
      type: String,
      default: "add",
    },
    handleRow: {
      type: Object,
      default: {},
    },
  },
  setup(props, { emit }) {
    const handleType = toRef(props, "handleType");
    const formRef = ref();
    const columns = [{
      title:'医废编号',
      dataIndex:'code'
    },{
      title:'医废类型',
      dataIndex:'wasteClassifyName'
    },{
      title:'收集重量',
      dataIndex:'weight'
    },{
      title:'收集时间',
      dataIndex:'createTime'
    }]
    const detailData = reactive({
      formState: {
        wasteBaseVoL: {},
      },
      dataForm: {
        wasteBox: {},
        wasteBases: [
          {
            hospitalPlaceName: "",
          },
        ],
        wasteBoxRecord: {},
      },
    });
    const timeFn = (d1) => {
      //di作为一个变量传进来
      //如果时间格式是正确的，那下面这一步转化时间格式就可以不用了
      if (!d1) return;
      var dateBegin = new Date(d1.replace(/-/g, "/")); //将-转化为/，使用new Date
      var dateEnd = new Date(); //获取当前时间
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); //计算出相差天数
      var leave1 = dateDiff % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
      var hours = Math.floor(leave1 / (3600 * 1000)); //计算出小时数
      //计算相差分钟数
      var leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
      var minutes = Math.floor(leave2 / (60 * 1000)); //计算相差分钟数
      //计算相差秒数
      var leave3 = leave2 % (60 * 1000); //计算分钟数后剩余的毫秒数
      var seconds = Math.round(leave3 / 1000);
      if (dayDiff > 0) {
        return `${dayDiff}天${hours}小时${minutes}分钟${seconds}秒`;
      } else if (hours > 0) {
        return `${hours}小时${minutes}分钟${seconds}秒`;
      } else if (minutes > 0) {
        return `${minutes}分钟${seconds}秒`;
      } else {
        return `${seconds}秒`;
      }
    };
    //获取详情
    const handleGetDetails = (_id) => {
      alarmRecordApi.warnBaseGetById(_id).then((res) => {
        if (res && res.success) {
          detailData.formState = res.data;
        }
      });
    };
    //获取详情
    const currentTableData = ref([])
    const handleGetDetailsWeight = (_id) => {
      console.log(2222)
      console.log(props.handleRow.objectType)
      if(props.handleRow.objectType != 'waste' && props.handleRow.objectType != 'depart'){

        alarmRecordApi.warnInfoByBoxRecordId(_id).then((res) => {
        if (res && res.success) {
          detailData.dataForm = res.data;
          currentTableData.value = detailData.dataForm.wasteBases.slice(0, 10);
        }
      });
      }else{
        alarmRecordApi.getWarnTimeAndWeight(_id).then((res) => {
          if (res && res.success) {
            detailData.dataForm = res.data;
          }
        });
      }
    };
    const userInfo = ref(getUserInfo() ? JSON.parse(getUserInfo()) : {});

    // 保存数据
    const handleSave = () => {
      if (props.handleType == "look") {
        resetForm();
        emit("finish");
        return false;
      }
      if (!detailData.formState.remark) {
        message.warning("请输入处理意见");
        return false;
      }
      let params = {
        id: detailData.formState.id,
        remark: detailData.formState.remark,
      };
      alarmRecordApi.warnBaseDeal(params).then((res) => {
        if (res && res.success) {
          message.success("操作成功");
          resetForm();
          emit("finish");
        } else {
        }
      });
    };
    const resetForm = () => {
      formRef.value.resetFields();
    };
    onMounted(async () => {
      handleGetDetails(props.handleRow.id);
      handleGetDetailsWeight(
        props.handleRow.objectType == "waste"
          ? props.handleRow.wasteBaseId
          : props.handleRow.objectId
      );
      if (props.handleType == "add") {
        formState.id = "";
        return false;
      }
    });

    return {
      formRef,
      timeFn,
      handleType,
      userInfo,
      wrapperCol: {
        span: 0,
      },
      ...toRefs(detailData),
    
      handleSave,
      resetForm,

      currentTableData,
      columns
    };
  },
});
</script>
<style lang="scss">
.info {
  width: 100%;
  background: #f0f2f5;
}
.mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}
</style>